$(document).ready(function() {
       // alert("aaaa");
        var userId = sessionStorage.getItem('userId');
        console.log(userId);
        //alert("year sales userId --->"+ userId);
    var vm = new Vue({
        el: "body",
        data: {
            //默认加载筛选条件存放容器
            "IP":'39.107.58.193:8080',
            "boardName":"年度-销售看板",
            "dataContainer":{},//当常用看板打开时，用于从url中获取筛选条件
            "selecShow":true,
            "backURL":'../manageBoard/',
            "year_month": [],//年份
            "pay_modal": [],//支付方式
            "opera_modal": [],//运营模式
            "pro_source": [],//产品来源
            "spike": [],//通路
            //"year":[],//年份
            //"month":["01","02","03","04","05","06","07","08","09","10","11","12"],//月份
            "provCity": [],//省市
            "skuAll": [],//所有的sku信息

            "provIdcity": [],//省对应的城市-//选中的省对应的城市列表列表信息
            "proName": "",//点击的省份名称
            "proId": "",//点击的省的id

            "getYear": '',//选中的日期
            "getMonth": '',//选中的月份
            "getPayItem": [],//选中的支付方式
            "getOperaItem": [],//选中的运营模式
            "getProSourceItem": [],//选中的产品来源

            "getProviceId": [],//选中的省份ID
            "getProviceLabel": [],//选中的省份label
            "getProviceStr": "",//选中的身份字符串

            "getAllCities": [],//获取所有的城市信息
            "getCityId": [],//选中的城市ID
            "getCityLabel": [],//选中的城市label
            "getCityStr": "",//选中的城市字符串

            "getSpikeId": [],//选中的通路ID
            "getSpikeLabel": [],//选中的通路label
            "getSpikeStr": "",//选中的通路字符串

            "getSkuId": [],//选中的sku信息
            "getSkuStr": "",//选中的sku字符串
            "getSkuLabel": [],//选中的skulabel


            "getCityPoint": [],//选择的城市下对应的点位
            "getPointId": [],//选中的点位ID
            "getPointStr": [],//选中的点位字符串
            "getPointLabel": [],//选中的点位label

            "modelSelect": {
                "model": "annual_sales_board",
                "condition": {
                    "year_month": "",
                    "pay_modal": [],
                    "opera_modal": [],
                    "prod_source": [],
                    "passageway": [],
                    "provice": [],
                    "city": [],
                    "sku_msg": [],
                    "point_location": []
                },//筛选条件
                "item": {
                    "main_index": {"sale_amount": 1},
                    "sale_amount": [1, 2]
                }//主指标
            }//筛选条件的数据查询条件
        },
        methods: {
            //加载筛选条件
            setSelect: function () {
                this.$http.post('http://'+this.IP+'/data-center/month/getScreenTerm?token='+userId,
                    {},
                    {emulateJSON: true})
                    .then(
                        function (res) {
                            console.log(res.data);
                            var data = res.data;
                            // this.year=data.year_month;
                            this.pay_modal = data.pay_modal;
                            this.pro_source = data.prod_source;
                            this.opera_modal = data.opera_modal;
                            this.spike = data.spike;
                            this.provCity = data.provice;
                            this.getAllCities = getCityes(this.provCity);
                            this.skuAll = data.sku_msg;
                            //console.log(this.getAllCities);
                        },
                        function (res) {
                            console.log(res.data);
                        });
                var modelSend = {
                    "model": 'annual_sales_board',
                    "condition": {"year_month": ''},
                    "item": {
                        "sale_amount": [1, 2],
                        "main_index": {"sale_amount": 1}//主指标
                    }//数据指标
                };
                this.dataContainer=decodeURI(getParamer('dataCondition'));//获取条件参数
                console.log(this.dataContainer);
                if(this.dataContainer=='undefined'){
                    this.selecShow=true;
                    this.backURL='../manageBoard/',
                    //如若存在条件，表示是从常用看板过来的，进行按条件绘制
                    modelSend.condition={"year_month": ''};

                }
                else{
                    this.selecShow=false;
                    this.backURL='../commonBoard/';
                    modelSend.condition=eval('(' + this.dataContainer + ')');

                }
                //销售看板
                var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/annualBoard/getAnnualBoardInfo?token='+userId, modelSend, 'salesChart');
                yearSalesChart.draw();

            },
            //根据省份展示城市
            showCity: function (proId, proName) {
                this.proName = proName;//动态变化选择市中省份名字
                this.proId = proId;
                //console.log(proId);
                //console.log(this.provCity);
                for (var i = 0; i < this.provCity.length; i++) {
                    if (this.provCity[i].id == proId) {
                        this.provIdcity = this.provCity[i].city;
                    }
                }
            },
            //获取选择的通路
            getSpike: function () {
                this.getSpikeLabel.length = 0;
                for (var i = 0; i < this.getSpikeId.length; i++) {
                    var id = this.getSpikeId[i];
                    for (var j = 0; j < this.spike.length; j++) {
                        var thisSpike = this.spike[j];
                        if (thisSpike.id == id) {
                            this.getSpikeLabel.push(thisSpike.label);
                        }
                    }
                }
                //选择的通路长度为14，大于14省略之后的
                this.getSpikeStr = this.getSpikeLabel.join(",").length > 15 ? this.getSpikeLabel.join(",").substr(0, 15) + "..." : this.getSpikeLabel.join(",");
            },
            //获取选择的sku
            getSku: function () {
                this.getSkuLabel.length = 0;
                for (var i = 0; i < this.getSkuId.length; i++) {
                    var id = this.getSkuId[i];
                    for (var j = 0; j < this.skuAll.length; j++) {
                        var thisSpike = this.skuAll[j];
                        if (thisSpike.id == id) {
                            this.getSkuLabel.push(thisSpike.label);
                        }
                    }
                }
                //选择的通路长度为14，大于14省略之后的
                this.getSkuStr = this.getSkuLabel.join(",").length > 15 ? this.getSkuLabel.join(",").substr(0, 15) + "..." : this.getSkuLabel.join(",");
            },
            //获取选择的省份
            getProv: function () {
                var arr = [];
                var selectPro = $("input[data-cacheval='false']");
                //console.log(selectPro);
                for (var i = 0; i < selectPro.length; i++) {
                    arr.push(selectPro[i].id);
                }
                this.getProviceId = arr;
                var arrLabel = [];
                for (var i = 0; i < arr.length; i++) {
                    for (var j = 0; j < this.provCity.length; j++) {
                        if (this.provCity[j].id == arr[i]) {
                            arrLabel.push(this.provCity[j].label);
                        }
                    }
                }
                this.getProviceLabel = arrLabel;
                this.getProviceStr = this.getProviceLabel.join(",").length > 15 ? this.getProviceLabel.join(",").substr(0, 15) + "..." : this.getProviceLabel.join(",");

            },
            //获取选择的城市
            getselCity: function () {
                //console.log(this.getAllCities);
                //根据选中的城市id获取选中的城市label
                var cityLabel = [];
                for (var i = 0; i < this.getCityId.length; i++) {
                    for (var j = 0; j < this.getAllCities.length; j++) {
                        if (this.getAllCities[j].id == this.getCityId[i]) {
                            cityLabel.push(this.getAllCities[j].label);
                        }
                    }
                }
                this.getCityLabel = cityLabel;
            },
            //获取点位信息
            getPoint: function () {
                console.log(this.getCityId);
                var arr = this.getCityId;
                var sendData = {"condition": {"city": arr}};
                console.log(sendData);
                this.$http.post('http://'+this.IP+'/data-center/month/getCityPoint?token='+userId,
                    {"paramData": JSON.stringify(sendData)},
                    {emulateJSON: true})
                    .then(
                        function (res) {
                            console.log(res.data);
                            this.getCityPoint = res.data.city_point;
                        },
                        function (res) {
                            console.log(res.data);
                        });
            },
            //获取选择的筛选条件并按条件绘图
            getSelect: function () {
                //console.log("年："+this.getYear);
                //console.log("月："+this.getMonth);
                //console.log("支付方式："+this.getPayItem);
                //console.log("运营模式："+this.getOperaItem);
                //console.log("产品来源："+this.getProSourceItem);
                //console.log("选中的通路："+this.getSpikeId);
                //console.log("选中的省份:"+this.getProviceId);
                //console.log("选中的城市:"+this.getCityId);

                //根据获取的筛选条件请求数据

                //this.modelSelect.condition.year_month=((this.getYear==0&&this.getMonth==0)?"":(this.getYear+"-"+this.getMonth));
                this.modelSelect.condition.year_month = this.getYear;
                this.modelSelect.condition.pay_modal = this.getPayItem;
                this.modelSelect.condition.opera_modal = this.getOperaItem;
                this.modelSelect.condition.prod_source = this.getProSourceItem;
                //选中的通路
                this.modelSelect.condition.passageway = this.getSpikeId;
                this.modelSelect.condition.provice = this.getProviceId;
                //选中的二级通路
                var getTwo = document.querySelectorAll('[name="accTwoCheck"]:checked');
                var arr = [];
                for (var i = 0; i < getTwo.length; i++) {
                    arr.push(getTwo[i].getAttribute('id'));
                }
                this.modelSelect.condition.getTwospike = arr;
                this.modelSelect.condition.city = this.getCityId;
                this.modelSelect.condition.sku_msg = this.getSkuId;
                this.modelSelect.condition.point_location = this.getPointId;
                this.modelSelect.item = {"main_index": {}};
                this.modelSelect.item.sale_amount = [1, 2];
                this.modelSelect.item.main_index.sale_amount = 1;
                var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                //console.log(a);
                //销售看板
                var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/annualBoard/getAnnualBoardInfo?token='+userId, a, 'salesChart');
                yearSalesChart.draw();
                //第一个a的class为actice
                $("#selMain li:first-child a").removeClass().addClass('ui-link ui-btn ui-btn-active');
            },
            //根据选择的主指标进行画图
            getMain: function (e) {
                var mainTag = e.target.getAttribute('tag');
                if (mainTag == "sale_amount") {
                    this.modelSelect.item = {"main_index": {}};
                    this.modelSelect.item.sale_amount = [1, 2];
                    this.modelSelect.item.main_index.sale_amount = 1;
                }
                else if (mainTag == "sku_sum") {
                    this.modelSelect.item = {"main_index": {}};
                    this.modelSelect.item.sku_sum = [1, 2];
                    this.modelSelect.item.main_index.sku_sum = 1;
                }
                else if (mainTag == "vender_sum") {
                    this.modelSelect.item = {"main_index": {}};
                    this.modelSelect.item.vender_sum = [1, 2];
                    this.modelSelect.item.main_index.vender_sum = 1;
                }
                if(this.dataContainer=='undefined'){
                    var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                    //console.log(a);
                    //销售看板
                    var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/annualBoard/getAnnualBoardInfo?token='+userId, a, 'salesChart');
                    yearSalesChart.draw();
                }
                else{
                    //如若存在条件，表示是从常用看板过来的，进行按条件绘制
                    this.modelSelect.condition=eval('(' + this.dataContainer + ')');
                    var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                    //console.log(a);
                    //销售看板
                    var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/annualBoard/getAnnualBoardInfo?token='+userId, a, 'salesChart');
                    yearSalesChart.draw();
                }

            },
            cancelUsual:function(){
                $("#myPopup").css("display","none");
                $("#myPopup-screen").css("display","none");

            },
            usualShow:function(){
                $("#myPopup").css("display","block");
                $("#myPopup-screen").css("display","block");
            },
            addUsual:function(){
                console.log(this.boardName);
                this.modelSelect.condition.year_month = this.getYear;
                this.modelSelect.condition.pay_modal = this.getPayItem;
                this.modelSelect.condition.opera_modal = this.getOperaItem;
                this.modelSelect.condition.prod_source = this.getProSourceItem;
                //选中的通路
                this.modelSelect.condition.passageway = this.getSpikeId;
                this.modelSelect.condition.provice = this.getProviceId;
                //选中的二级通路
                var getTwo = document.querySelectorAll('[name="accTwoCheck"]:checked');
                var arr = [];
                for (var i = 0; i < getTwo.length; i++) {
                    arr.push(getTwo[i].getAttribute('id'));
                }
                this.modelSelect.condition.getTwospike = arr;
                this.modelSelect.condition.city = this.getCityId;
                this.modelSelect.condition.sku_msg = this.getSkuId;
                this.modelSelect.condition.point_location = this.getPointId;
                this.modelSelect.item = {"main_index": {}};
                this.modelSelect.item.sale_amount = [1, 2];
                this.modelSelect.item.main_index.sale_amount = 1;
                this.modelSelect.condition.boardName=this.boardName;
                var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                console.log(a);
                this.$http.post('http://'+this.IP+'/data-center/CommonBoard/getCommonBoardInfo?token='+userId,
                    {"paramData": JSON.stringify(a)},
                    {emulateJSON: true})
                    .then(
                        function (res) {
                            $("#myPopup").css("display","none");
                            $("#myPopup-screen").css("display","none");
                        },
                        function (res) {
                            alert("保存失败");
                        });
            }
        }
    });
    //默认执行页面
    vm.setSelect();
}
)
//获取所有的城市
function getCityes(arrList){
    var arr=[];

    for(var i=0;i<arrList.length;i++){
        var pro=arrList[i].city;
        //console.log(pro);
        for(var j=0;j<pro.length;j++){
            var city=pro[j];
            arr.push(city);
        }
    }
    return arr;
}
//方法获取浏览器的url中的参数
function getParamer(paramer){
    var url=window.location.href.split("?")[1];
    if(url){
    if(url.indexOf("&")>0){
       var urlParamArry=url.split("&");
        for(var i=0; i<urlParamArry.length; i++){
            var paramerName=urlParamArry[i].split("=");
            if(paramer==paramerName[0]){
                return paramerName[1];
            }
        }
    }else{
        var paramerValue=url.split("=")[1];
        return paramerValue;
    }
    }
}